<template>  
  <view class="container">  
    <view class="rotating-box"></view>  
  </view>  
</template>
<script>  
export default {  
  name: 'RotatingAnimation',  
};  
</script>
<style scoped>  
.container {  
  display: flex;  
  justify-content: center;  
  align-items: center;  
  height: 100vh; /* 满屏高度 */  

}  

.rotating-box {  
  width: 1000rpx; /* 可以调整宽度 */  
  height: 1000rpx; /* 可以调整高度 */  
  background: conic-gradient(  
    from 90deg at 50% 50%,   
    rgba(75, 163, 103, 0.00) 270deg,   
    rgba(75, 163, 103, 0.40) 360deg  
  );  
  border-radius: 50%; /* 使其成为圆形 */  
  animation: rotate 2s linear infinite; /* 设置旋转动画 */  
}  

@keyframes rotate {  
  from {  
    transform: rotate(0deg);  
  }  
  to {  
    transform: rotate(360deg);  
  }  
}  
</style>